<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>2.html</title>
</head>

<body>
  <h1 id="h1">我是2.html网页</h1>
  <p class="content"></p>
  <input type="text">
  <button id="btn">把值传给window和自己的iframe</button>
  <button id="btn-ty">同域传输数据</button>
  <iframe src="3.html" width="200" height="200" id="demo2" name="demo2"></iframe>
</body>

</html>
<script>
  const iframe3 = window.document.getElementById('demo2')
  let iframe3Window = null,
  iframe3Document = null
  iframe3.addEventListener('load', function () {
    iframe3Window = iframe3.contentWindow
    console.log('2.html',iframe3Window)
    iframe3Document = iframe3.contentDocument
    console.log('2.html',iframe3Document)
    iframe3Document.body.style.backgroundColor ='orange'
  }, false)

  document.getElementById('btn').addEventListener('click', function () {
    const value = document.getElementsByTagName('input')[0].value
    window.top.document.getElementsByClassName('content')[0].innerHTML = value
    iframe3Document.getElementsByClassName('content')[0].innerHTML = value
    
  }, false)

  function childMethod () {
    console.log('iframe2-method')
  }
  var childObj = {
    name: '郭青松',
    age: 22,
    gender: 'female'
  }
  document.getElementById('btn-ty').addEventListener('click', function () {
    // 第一个参数,数据.第二个参数可以接受这个数据的域名 
    // 同域好像不能这么用.
    window.self.postMessage('我是2.html通过postMessage同域传递过来的数据','http://127.0.0.1:55313/')
  }, false)
</script>